<template>
  <a-modal v-model:visible="visible" draggable :footer="false" width="1000px">
    <template #title> 发票推送日志</template>
    <a-table
      row-key="id"
      :loading="loading"
      :data="renderData"
      :bordered="false"
      :pagination="false"
    >
      <template #columns>
        <a-table-column title="序号" :width="60">
          <template #cell="{ rowIndex }">
            {{ rowIndex + 1 }}
          </template>
        </a-table-column>

        <a-table-column title="OA单据号" width="140" data-index="auditNumber" />
        <a-table-column title="财务tplus凭证号" width="140" data-index="voucherNumber" />
        <a-table-column title="日志正文" data-index="logContent" />
        <a-table-column title="是否成功" width="90" data-index="sucessFlag">
          <template #cell="{ record }">
            {{ record.sucessFlag === '1' ? '成功' : '失败' }}
          </template>
        </a-table-column>
      </template>
    </a-table>
  </a-modal>
</template>

<script lang="ts" setup>
  import { ref } from 'vue';
  import { OperationLog, push2TplusLog } from '@/api/invoice';
  import useLoading from '@/hooks/loading';

  const { loading, setLoading } = useLoading();
  const visible = ref(false);
  const renderData = ref<OperationLog[]>([]);

  function handleChangeVisible(id: string) {
    setLoading(true);
    visible.value = !visible.value;
    push2TplusLog(id)
      .then((res) => {
        setLoading(false);
        renderData.value = res.data;
      })
      .catch((e) => {
        setLoading(false);
      });
  }

  defineExpose({ handleChangeVisible });
</script>
